{% load i18n %}

<h1 class="first-heading">
    {{ category.name }}
</h1>
<div class="description">
    {{ category.description|safe }}
</div>
<div id="categories">
    <table class="lfs-default">
        {% for row in categories %}
            <tr>
                {% for category in row %}
                    <td class="category-row">
                        <h2 class="first-heading">{{ category.name }}</h2>
                        {% if category.get_image %}
                        <div class="category-image">
                            <a href="{% url lfs_category category.slug %}">
                                <img src="{{ category.get_image.url_100x100 }}"
                                     alt="{{ category.name }}" />
                            </a>
                        </div>
                        {% endif %}
                        <div class="category-description">
                            {{ category.short_description|safe }}
                        </div>
                        <div class="clear details-button">
                            <a class="button emphasized"
                               href="{% url lfs_category category.slug %}">{% trans 'Details' %}
                            </a>
                        </div>
                        <hr>
                    </td>
                {% endfor %}
            </tr>
        {% endfor %}
    </table>
</div>
